<template>
	<div class="bigDiv">
		<el-form :inline="true" label-width="120px">
			<div class="topNav">
				<el-button type="text" icon="el-icon-search" @click="getList" style="float:right;">搜索</el-button>
				<el-button type="text" icon="el-icon-refresh" @click="reset"
					style="float:right;margin-right:10px;">重置</el-button>
				<el-button type="text" icon="el-icon-plus" @click="editProduct">新增缴费</el-button>
			</div>
			<el-row :gutter="20">
				<div style="margin:0 20px;">
					<el-form-item label="房间编号">
						<el-input v-model="queryParams.resourceName" @blur="getInfo" />
					</el-form-item>
					<!-- <el-form-item label="收费项目">
						<el-select v-model="queryParams.feeItemId" placeholder="请选择" clearable>
							<el-option v-for="(item, index) in feeItemList" :key="index" :label="item.name"
								:value="item.id" :disabled="item.disabled"></el-option>
						</el-select>
					</el-form-item> -->
					<el-form-item label="缴费单号">
						<el-input v-model="queryParams.payLogNo" placeholder="请输入" clearable></el-input>
					</el-form-item>
					<el-form-item label="付款方式">
						<el-select v-model="queryParams.payState" placeholder="请选择">
							<el-option value="现金" label="现金"></el-option>
							<el-option value="刷卡" label="刷卡"></el-option>
							<el-option value="建行码" label="建行码"></el-option>
							<el-option value="转账" label="转账"></el-option>
						</el-select>
					</el-form-item>
					<!-- <el-form-item label="付款状态">
						<el-select v-model="queryParams.payState" placeholder="请选择">
							<el-option value="未付款" label="未付款"></el-option>
							<el-option value="已付款" label="已付款"></el-option>
							<el-option value="已退款" label="已退款"></el-option>
						</el-select>
					</el-form-item> -->
					<!-- <el-form-item label="截止时间">
						<el-date-picker v-model="pickerVal" type="daterange" start-placeholder="开始日期"
							end-placeholder="结束日期" :picker-options="pickerOptions" value-format="timestamp" clearable
							:editable="false"></el-date-picker>
					</el-form-item>
					<el-form-item label="缴费时间">
						<el-date-picker v-model="pickerPayVal" type="daterange" start-placeholder="开始日期"
							end-placeholder="结束日期" :picker-options="pickerOptions" value-format="timestamp" clearable
							:editable="false"></el-date-picker>
					</el-form-item> -->
				</div>
			</el-row>
			<el-row v-if="dict.ownerName">
				<div style="padding:0 20px;margin-bottom:20px;">
					业主名称:{{dict.ownerName}}&nbsp;&nbsp;&nbsp;&nbsp;建筑面积:{{dict.buildingSquare}}&nbsp;&nbsp;&nbsp;&nbsp;物业费:{{dict.decStrataFee}}&nbsp;&nbsp;&nbsp;&nbsp;
					电梯费:{{dict.decElevatorFee}}&nbsp;&nbsp;&nbsp;&nbsp;停车费:{{dict.decParkingFee}}&nbsp;&nbsp;&nbsp;&nbsp;公共设施维修费:{{dict.decGg}}
				</div>
			</el-row>
		</el-form>
		<el-table v-loading="loading" :data="list" border height="calc(100vh - 380px)">
			<el-table-column prop="resourceName" label="房间编号" align="center" width="100" />
			<!-- <el-table-column prop="feeItemName" label="收费项名" align="center" width="150" /> -->
			<el-table-column prop="ownerName" label="客户姓名" align="center" width="100" />
			<el-table-column prop="beginDate" label="费用开始时间" align="center" width="150" />
			<el-table-column prop="endDate" label="费用结束时间" align="center" width="150" />
			<!-- <el-table-column prop="lastIndex" label="上次读数" align="center" />
			<el-table-column prop="currentIndex" label="本次读数" align="center" />
			<el-table-column prop="multiple" label="倍率" align="center" />
			<el-table-column prop="loss" label="损耗" align="center" />
			<el-table-column prop="num" label="数量" align="center" /> -->
			<!-- <el-table-column prop="price" label="单价" align="center" /> -->
			<!-- <el-table-column prop="total" label="金额" align="center" />
			<el-table-column prop="receivable" label="实收金额" align="center" />
			<el-table-column label="付款状态" align="center">
				<template slot-scope="scope">
					<el-tag size="small" v-if="scope.row.payLogId !== ''">已付款</el-tag>
					<el-tag size="small" type="danger" v-if="scope.row.payLogId === ''">未付款</el-tag>
				</template>
			</el-table-column> -->
			<!-- <el-table-column label="退款状态" align="center">
				<template slot-scope="scope">
					<el-tag size="small" v-if="scope.row.refundState === 0">未退款</el-tag>
					<el-tag size="small" type="danger" v-if="scope.row.refundState === 1">部分退款</el-tag>
					<el-tag size="small" type="danger" v-if="scope.row.refundState === 2">全部退款</el-tag>
				</template>
			</el-table-column>
			<el-table-column prop="refundAmount" label="退款总金额" align="center" width="130" />
			<el-table-column prop="payLogNo" label="缴费单号" align="center" width="150" />
			<el-table-column prop="payTime" label="缴费时间" align="center" width="150" /> -->


			<el-table-column prop="priceGg" label="公共设施维修费" align="center" width="150" />
			<el-table-column prop="payStateGg" label="公共设施维修费缴费状态" align="center" />
			<el-table-column prop="payDateGg" label="公共设施维修费缴费时间" align="center" />
			<el-table-column prop="feeItemId" label="付款方式" align="center" width="150" />


			<el-table-column label="操作" align="center" width="220" fixed="right">
				<template slot-scope="scope">
					<div class="centered-content">
						<!-- <el-button type="text" size="mini" class="editBtn" @click="editProduct(scope.row)">
							编辑
						</el-button> -->
						<el-button type="text" size="mini" class="deleteBtn" @click="delProduct(scope.row)">
							删除
						</el-button>
						<el-button type="text" size="mini" class="detailBtn" @click="lookProduct(scope.row)">
							详情
						</el-button>
						<el-button type="text" size="mini" class="detailBtn" @click="payMoney(scope.row)">
							缴费
						</el-button>
					</div>
				</template>
			</el-table-column>
		</el-table>
		<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum"
			:limit.sync="queryParams.pageSize" @pagination="getList" />

		<!-- 投诉维护弹窗 -->
		<el-dialog title="缴费维护" :visible.sync="productModel" :close-on-click-modal="false"
			:close-on-press-escape="false" width="40%">
			<el-form ref="form" :model="dataForm" :rules="rules" label-width="130px" :disabled="canEdit">
				<p style="text-align:center;font-weight:bold;margin-bottom:20px;">基础信息</p>
				<el-row :gutter="20">
					<el-col :span="24">
						<el-form-item label="房间编号" prop="resourceName">
							<el-input v-model="dataForm.resourceName" :customStyle="{ width: '100%' }"
								@blur="getInfo2" />
						</el-form-item>
					</el-col>
					<el-col :span="12" style="height:59px">
						<el-form-item label="客户姓名" prop="ownerName">
							<el-input v-model="dataForm.ownerName" placeholder="请输入" :maxlength="50" clearable disabled
								:style="{ width: '100%' }"></el-input>
						</el-form-item>
					</el-col>

					<el-col :span="12" style="height:59px">
						<el-form-item label="建筑面积" prop="buildingSquare">
							<el-input v-model="dataForm.buildingSquare" placeholder="请输入" clearable disabled
								:style="{ width: '100%' }"></el-input>
						</el-form-item>
					</el-col>
					<el-col :span="12" style="height:59px">
						<el-form-item label="公共设施维修费率" prop="decGg">
							<el-input v-model="dataForm.decGg" placeholder="请输入" :maxlength="50" clearable disabled
								:style="{ width: '100%' }"></el-input>
						</el-form-item>
					</el-col>
					<el-col :span="12" style="height:59px">
						<el-form-item label="付款方式">
							<el-select v-model="dataForm.payState" placeholder="请选择">
								<el-option value="现金" label="现金"></el-option>
								<el-option value="刷卡" label="刷卡"></el-option>
								<el-option value="建行码" label="建行码"></el-option>
								<el-option value="转账" label="转账"></el-option>
							</el-select>
						</el-form-item>
					</el-col>
					<el-col :span="24" style="height:59px">
						<el-form-item label="开始日期" prop="currentDate">
							<el-date-picker v-model="dataForm.currentDate" type="daterange" range-separator="至"
								start-placeholder="开始日期" end-placeholder="结束日期" format="yyyy-MM-dd"
								value-format="yyyy-MM-dd" :style="{ width: '100%' }" @change="getInfo2"
								:picker-options="pickerOptions">
								<!-- :picker-options="pickerOptions" -->
							</el-date-picker>
						</el-form-item>
					</el-col>


				</el-row>
				<p style="text-align:center;font-weight:bold;margin-bottom:20px;">费用信息</p>
				<el-row :gutter="20">
					<el-col :span="12" style="height:59px">
						<el-form-item label="公共设施维修费" prop="priceGg">
							<el-input v-model="dataForm.priceGg" placeholder="请输入" clearable
								:style="{ width: '100%' }"></el-input>
						</el-form-item>
					</el-col>
				</el-row>

			</el-form>
			<span slot="footer" class="dialog-footer" v-if="!canEdit">
				<el-button @click="productModel = false">取 消</el-button>
				<el-button type="primary" @click="submitProduct()">确 定</el-button>
			</span>
		</el-dialog>





		<!-- 投诉维护弹窗 -->
		<el-dialog title="收款" :visible.sync="payModel" :close-on-click-modal="false" :close-on-press-escape="false"
			width="40%">
			<el-form ref="form" :model="dataForm" :rules="rules" label-width="130px">
				<el-row :gutter="24">
					<el-col :span="12">
						<el-form-item label="账单号" disabled>
							<el-input v-model="dataForm.fee_item_id" :customStyle="{ width: '100%' }" disabled />
						</el-form-item>
					</el-col>
					<el-col :span="12">
						<el-form-item label="业主姓名">
							<el-input v-model="dataForm.ownerName" :customStyle="{ width: '100%' }" disabled />
						</el-form-item>
					</el-col>
					<el-col :span="12">
						<el-form-item label="楼号">
							<el-input v-model="dataForm.buildingName" :customStyle="{ width: '100%' }" disabled />
						</el-form-item>
					</el-col>
					<el-col :span="12">
						<el-form-item label="房号">
							<el-input v-model="dataForm.hname" :customStyle="{ width: '100%' }" disabled />
						</el-form-item>
					</el-col>
					<el-col :span="24">
						<el-form-item label="选择缴费">
							<el-checkbox-group v-model="types" @change="handleInvertCheckChange">
								<el-checkbox :label="item" v-for="item in checkList" :value="item"
									:key="item"></el-checkbox>
							</el-checkbox-group>
						</el-form-item>
					</el-col>
					<el-form-item label="付款方式">
						<el-select v-model="dataForm.payState" placeholder="请选择">
							<el-option value="现金" label="现金"></el-option>
							<el-option value="刷卡" label="刷卡"></el-option>
							<el-option value="建行码" label="建行码"></el-option>
							<el-option value="转账" label="转账"></el-option>
						</el-select>
					</el-form-item>
					<el-col :span="21">
						<el-form-item label="物业费">
							<!-- <el-input v-model="dataForm.priceWy" :customStyle="{ width: '100%' }" disabled /> -->
							<el-input-number v-model="dataForm.priceWy" :precision="2" :controls="false"
								:customStyle="{ width: '100%' }" disabled />
						</el-form-item>
						</el-form-item>
					</el-col>
					<el-col :span="21">
						<el-form-item label="电梯费">
							<el-input v-model="dataForm.priceDt" :customStyle="{ width: '100%' }" disabled />
						</el-form-item>
					</el-col>
					<el-col :span="21">
						<el-form-item label="车位费">
							<el-input v-model="dataForm.priceTc" :customStyle="{ width: '100%' }" disabled />
						</el-form-item>
					</el-col>
					<el-col :span="21">
						<el-form-item label="收款金额">
							<el-input v-model="dataForm.big" :customStyle="{ width: '100%' }" disabled />
						</el-form-item>
					</el-col>
					<el-col :span="21">
						<el-form-item label="发票号">
							<el-input v-model="dataForm.feeItemId" :customStyle="{ width: '100%' }"
								placeholder="请输入发票号" />
						</el-form-item>
					</el-col>
					<el-col :span="21">
						<el-form-item label="合计">
							<el-input v-model="dataForm.total" :customStyle="{ width: '100%' }" disabled />
						</el-form-item>
					</el-col>
				</el-row>
			</el-form>
			<span slot="footer" class="dialog-footer">
				<el-button type="primary" @click="submitProduct2()">收款</el-button>
			</span>
		</el-dialog>
	</div>
</template>

<script>
	// 上传文件
	import {
		selectConfigPaymentBillBlock,
		insertConfigPaymentBillBlock,
		editConfigPaymentBillBlock,
		deleteConfigPaymentBillBlock,
		selectConfigHouseBlock,
		selectConfigFeeItemBlock,
		selectFeeByHouseName
	} from '@/api/wuye.js'
	import fileUpdata from '@/api/file.config'
	export default {
		name: "wuyefei",
		// 页面数据
		data() {
			return {
				checkList: ['公共设施维修费缴费'],
				queryParams: {
					currentPage: 1,
					pageSize: 10,
					instanceId: null,
					no: null,
					title: null,
					applyPhone: null,
					applyName: null,
					applyCategory: null,
					applyContent: null,
					applyHouse: null,
					applyTime: null,
					applyImg: null,
					appContent: null,
					appointmentTime: null,
					appTime: null,
					assigneeUser: null,
					assigneeContent: null,
					returnState: null,
					returnResult: null,
					returnRemark: null,
					endTime: null,
					state: null,
					client: null,
					enabledMark: '1'
				},
				pickerVal: [],

				pickerOptions: {
					disabledDate: time => {
						if (this.currentDate == null) {
							return false
						} else {
							return (this.currentDate.getFullYear() != time.getFullYear())
						}
					},
					onPick: date => {
						// 如果只选择一个则保存至selectDate 否则selectDate 为空
						if (date.minDate && !date.maxDate) {
							this.currentDate = date.minDate
						} else {
							this.currentDate = null
						}
					}
				},
				houseList: [],
				dataForm: {
					resourceId: undefined,
					resourceName: undefined,
					feeUser: undefined,
					feeItemId: undefined,
					chargingItemName: undefined,
					endDate: undefined,
					beginDate: undefined,
					deadline: undefined,
					lastIndex: '0',
					currentIndex: '0',
					multiple: '1',
					loss: '0',
					price: '0',
					num: '0',
					lateFee: '0',
					discount: '0',
					receivable: '0',
					total: '0',
					currentDate: undefined,
					buildingSquare: undefined,
					feeItemId: ''
				},
				types: ['公共设施维修费缴费'],
				editId: '',
				loading: false,
				list: [],
				total: 0, // 一共多少条数据
				productModel: false,
				payModel: false,
				pickerPayVal: [],
				rules: {
					resourceName: [{
						required: true,
						message: '请输入编号并点击搜索',
						trigger: 'blur',
					}, ],
					applyHouse: [{
						required: true,
						message: '请选择房间列表',
						trigger: 'blur',
					}, ],
					feeUser: [{
						required: true,
						message: '请输入客户姓名',
						trigger: 'blur',
					}, ],
					// resourceId: [{
					// 	required: true,
					// 	message: '请输入',
					// 	trigger: 'blur',
					// }, ],
					feeItemId: [{
						required: true,
						message: '请选择收费项目',
						trigger: 'blur',
					}, ],
					// chargingItemName: [{
					// 	required: true,
					// 	message: '请输入',
					// 	trigger: 'blur',
					// }, ],
					endDate: [{
						required: true,
						message: '请选择结束日期',
						trigger: 'blur',
					}, ],
					beginDate: [{
						required: true,
						message: '请选择开始日期',
						trigger: 'blur',
					}, ],
					priceWy: [{
						required: true,
						message: '请输入物业费',
						trigger: 'blur',
					}, ],
					payStateWy: [{
						required: true,
						message: '请选择物业费缴费状态',
						trigger: 'blur',
					}, ],
					payDateWy: [{
						required: true,
						message: '请选择物业费缴费时间',
						trigger: 'blur',
					}, ],
					priceDt: [{
						required: true,
						message: '请输入电梯费',
						trigger: 'blur',
					}, ],
					payDateDt: [{
						required: true,
						message: '请选择电梯费缴费状态',
						trigger: 'blur',
					}, ],
					applyHouse: [{
						required: true,
						message: '请选择电梯费缴费时间',
						trigger: 'blur',
					}, ],
					priceTc: [{
						required: true,
						message: '请输入停车费',
						trigger: 'blur',
					}, ],
					payStateTc: [{
						required: true,
						message: '请选择停车费缴费状态',
						trigger: 'blur',
					}, ],
					payDateTc: [{
						required: true,
						message: '请选择停车费缴费时间',
						trigger: 'blur',
					}, ],
					// deadline: [{
					// 	required: true,
					// 	message: '请选择',
					// 	trigger: 'blur',
					// }, ],
					lastIndex: [{
							pattern: /^[1-9]\d*\.\d*|0\.\d*[1-9]\d*|0?\.0+|0|[1-9]\d*$/,
							message: '请输入正确的数字,最多两位小数',
							trigger: 'blur',
						},
						{
							pattern: /^(([1-9]{1}\d{0,7})|(0{1}))(\.\d{0,2})?$/,
							message: '小数点前最多8位数字',
							trigger: 'blur'
						},
					],
					currentIndex: [{
							pattern: /^[1-9]\d*\.\d*|0\.\d*[1-9]\d*|0?\.0+|0|[1-9]\d*$/,
							message: '请输入正确的数字,最多两位小数',
							trigger: 'blur',
						},
						{
							pattern: /^(([1-9]{1}\d{0,7})|(0{1}))(\.\d{0,2})?$/,
							message: '小数点前最多8位数字',
							trigger: 'blur'
						},
					],
					multiple: [{
							pattern: /^[1-9]\d*\.\d*|0\.\d*[1-9]\d*|0?\.0+|0|[1-9]\d*$/,
							message: '请输入正确的数字,最多两位小数',
							trigger: 'blur',
						},
						{
							pattern: /^(([1-9]{1}\d{0,1})|(0{1}))(\.\d{0,2})?$/,
							message: '小数点前最多2位数字',
							trigger: 'blur'
						},
					],
					loss: [{
							pattern: /^[1-9]\d*\.\d*|0\.\d*[1-9]\d*|0?\.0+|0|[1-9]\d*$/,
							message: '请输入正确的数字,最多两位小数',
							trigger: 'blur',
						},
						{
							pattern: /^(([1-9]{1}\d{0,7})|(0{1}))(\.\d{0,2})?$/,
							message: '小数点前最多8位数字',
							trigger: 'blur'
						},
					],
					price: [{
							required: true,
							message: '请输入单价',
							trigger: 'blur',
						},
						{
							pattern: /^[1-9]\d*\.\d*|0\.\d*[1-9]\d*|0?\.0+|0|[1-9]\d*$/,
							message: '请输入正确的金额',
							trigger: 'blur',
						},
						{
							pattern: /^(([1-9]{1}\d{0,5})|(0{1}))(\.\d{0,4})?$/,
							message: '小数点前最多6位数字',
							trigger: 'blur'
						},
					],
					num: [{
							required: true,
							message: '请输入',
							trigger: 'blur',
						},
						{
							pattern: /^[1-9]\d*\.\d*|0\.\d*[1-9]\d*|0?\.0+|0|[1-9]\d*$/,
							message: '请输入正确的数字',
							trigger: 'blur',
						},
						{
							pattern: /^(([1-9]{1}\d{0,7})|(0{1}))(\.\d{0,2})?$/,
							message: '小数点前最多8位数字',
							trigger: 'blur'
						},
					],
					lateFee: [{
							required: true,
							message: '请输入',
							trigger: 'blur',
						},
						{
							pattern: /^[1-9]\d*\.\d*|0\.\d*[1-9]\d*|0?\.0+|0|[1-9]\d*$/,
							message: '请输入正确的金额',
							trigger: 'blur',
						},
					],
					discount: [{
							required: true,
							message: '请输入',
							trigger: 'blur',
						},
						{
							pattern: /^[1-9]\d*\.\d*|0\.\d*[1-9]\d*|0?\.0+|0|[1-9]\d*$/,
							message: '请输入正确的金额',
							trigger: 'blur',
						},
						{
							pattern: /^(([1-9]{1}\d{0,7})|(0{1}))(\.\d{0,2})?$/,
							message: '小数点前最多8位数字',
							trigger: 'blur'
						},
					],
					total: [{
							required: true,
							message: '请输入',
							trigger: 'blur',
						},
						{
							pattern: /^[1-9]\d*\.\d*|0\.\d*[1-9]\d*|0?\.0+|0|[1-9]\d*$/,
							message: '请输入正确的金额',
							trigger: 'blur',
						},
						{
							pattern: /^(([1-9]{1}\d{0,7})|(0{1}))(\.\d{0,2})?$/,
							message: '小数点前最多8位数字',
							trigger: 'blur'
						},
					],
				},
				typeOptions: [{
						fullName: '常规收费项（商铺）',
						id: 'house'
					},
					{
						fullName: '临时收费项',
						id: 'temp'
					},
					{
						fullName: '押金类收费项',
						id: 'deposit'
					},
				],
				canEdit: false,
				dict: {},
				selectFee: null,
				pickerOptions: {
					disabledDate: time => {
						if (this.currentDate == null) {
							return false
						} else {
							return (this.currentDate.getFullYear() != time.getFullYear())
						}
					},
					onPick: date => {
						// 如果只选择一个则保存至selectDate 否则selectDate 为空
						if (date.minDate && !date.maxDate) {
							this.currentDate = date.minDate
						} else {
							this.currentDate = null
						}
					}
				},
			};
		},
		// 初始化
		mounted() {
			this.getList();
			this.getFeeList();
		},
		// 函数集合
		methods: {
			submitProduct2() {
				if (this.selectFee && this.selectFee.length > 0) {
					if (this.selectFee.indexOf("公共设施维修费缴费") > -1) {
						this.dataForm.payStateWy = "已缴费"
					}
					editConfigPaymentBillBlock({
						...this.dataForm
					}).then(res => {
						if (res.code == 200) {
							this.$message({
								message: res.msg,
								type: 'success',
								duration: 1000,
								onClose: () => {
									this.payModel = false;
									this.getList();
								},
							});
						}
					})
				} else {
					return this.$message.error({
						message: "请选择缴费项目"
					})
				}
			},

			getInfo2() {
				var that = this;
				selectFeeByHouseName({
					name: this.dataForm.resourceName
				}).then(res => {
					if (res.code == 200) {
						if (res.rows.length > 0) {
							that.dataForm.ownerName = res.rows[0].ownerName
							that.dataForm.buildingSquare = res.rows[0].buildingSquare
							that.dataForm.decGg = res.rows[0].decGg;
							that.$forceUpdate();
							var a = new Date(that.dataForm.currentDate[0]).getMonth();
							var b = new Date(that.dataForm.currentDate[1]).getMonth();
							var e = b - a + 1;
							that.dataForm.priceGg = that.dataForm.decGg * e;
							that.$forceUpdate();

						}
					}
				})
			},
			handleInvertCheckChange(e) {
				var total = 0;
				if (e.indexOf("公共设施维修费缴费") > -1) {
					total += this.dataForm.priceWy
				}
				this.selectFee = e;
				this.dataForm.total = total;
				this.$forceUpdate()
				var texts = this.numberToChinese(total);
				this.dataForm.big = texts;

			},
			numberToChinese(num) {
				var AA = new Array("零", "一", "二", "三", "四", "五", "六", "七", "八", "九", "十");
				var BB = new Array("", "十", "百", "仟", "萬", "億", "点", "");
				var a = ("" + num).replace(/(^0*)/g, "").split("."),
					k = 0,
					re = "";
				for (var i = a[0].length - 1; i >= 0; i--) {
					switch (k) {
						case 0:
							re = BB[7] + re;
							break;
						case 4:
							if (!new RegExp("0{4}//d{" + (a[0].length - i - 1) + "}$").test(a[0]))
								re = BB[4] + re;
							break;
						case 8:
							re = BB[5] + re;
							BB[7] = BB[5];
							k = 0;
							break;
					}
					if (k % 4 == 2 && a[0].charAt(i + 2) != 0 && a[0].charAt(i + 1) == 0)
						re = AA[0] + re;
					if (a[0].charAt(i) != 0)
						re = AA[a[0].charAt(i)] + BB[k % 4] + re;
					k++;
				}
				if (a.length > 1) // 加上小数部分(如果有小数部分)
				{
					re += BB[6];
					for (var i = 0; i < a[1].length; i++)
						re += AA[a[1].charAt(i)];
				}
				if (re == '一十')
					re = "十";
				if (re.match(/^一/) && re.length == 3)
					re = re.replace("一", "");
				re = re + "圆整"
				return re;
			},
			getInfo() {
				var that = this;
				this.dict = {};
				selectFeeByHouseName({
					name: this.queryParams.resourceName
				}).then(res => {
					if (res.code == 200) {
						if (res.rows.length > 0) {
							this.dict = res.rows[0]
						}
					}
				})
			},
			changePrice() {
				for (var i = 0; i < this.checkList.length; i++) {
					if (this.checkList[i].id == this.dataForm.feeItemId) {
						this.dataForm.price = this.checkList[i].price;
						this.dataForm.price = this.checkList[i].price;
					}
				}
			},
			getFeeList() {
				selectConfigFeeItemBlock().then(res => {
					this.feeItemList = res.rows;
				})
			},
			lookProduct(row) {
				this.canEdit = true;
				this.dataForm = row;
				this.productModel = true;
			},
			payMoney(row) {
				this.dataForm = row;
				this.payModel = true;

				this.selectFee = ['公共设施维修费缴费'];
				var total = 0;
				total += this.dataForm.priceWy
				total += this.dataForm.priceDt
				total += this.dataForm.priceTc
				this.dataForm.total = total;
				this.$forceUpdate()
				var texts = this.numberToChinese(total);
				this.dataForm.big = texts;
			},
			searchHouse() {
				this.houseList = [];
				selectConfigHouseBlock({
					name: this.dataForm.applyHouse
				}).then(res => {
					this.houseList = res.rows;
				})
			},
			// 修改投诉
			editProduct(row) {
				this.searchHouse();
				this.editId = row.id
				this.canEdit = false;
				if (row.id) {
					// 修改
					this.dataForm = row;
				} else {
					// 新增
					this.dataForm = {};
					// this.dataForm.beginDate = "2024-01-01"
					// this.dataForm.endDate = "2024-12-31"
					// this.dataForm.payDateWy =  new Date();

				}
				console.log('dataForm', this.dataForm)
				this.productModel = true;
			},
			// 删除投诉
			delProduct(row) {
				this.$confirm("是否删除？", "提示", {
						confirmButtonText: "确 认",
						cancelButtonText: "取 消"
					}).then(() => {
						deleteConfigPaymentBillBlock({
							...row
						}).then(res => {
							if (res.code == 200) {
								this.$message({
									message: res.msg,
									type: 'success',
									duration: 1000,
									onClose: () => {
										this.visible = false;
										this.$message.success("删除投诉成功");
										this.getList();
									},
								});
							}
						})
					})
					.catch(() => console.info("操作取消"));
			},
			//提交投诉
			submitProduct() {
				this.dataForm.state = "维修中";
				this.dataForm.type = "住宅"
				this.$refs['form'].validate(valid => {
					if (valid) {
						if (this.editId) {
							editConfigPaymentBillBlock({
								...this.dataForm
							}).then(res => {
								if (res.code == 200) {
									this.$message({
										message: res.msg,
										type: 'success',
										duration: 1000,
										onClose: () => {
											this.productModel = false;
											this.getList();
										},
									});
								}
							})
						} else {
							insertConfigPaymentBillBlock({
								...this.dataForm
							}).then(res => {
								if (res.code == 200) {
									this.$message({
										message: res.msg,
										type: 'success',
										duration: 1000,
										onClose: () => {
											this.productModel = false;
											this.getList();
										},
									});
								}
							})
						}
					}
				})

			},
			//初始化列表
			getList() {
				this.loading = false;
				this.queryParams.type = '住宅';
				selectConfigPaymentBillBlock({
					...this.queryParams
				}).then(res => {
					this.list = res.rows;
					this.total = res.total
				})
			},
			reset() {
				this.queryParams = {
					id: null,
					no: null,
					title: null,
					applyPhone: null,
					applyName: null,
					applyCategory: null,
					applyContent: null,
					applyHouse: null,
					applyTime: null,
					applyImg: null,
					state: null,
					client: 'web_company',
					remark: null,
				};
				this.resetForm('form');
			},

			changeIndex() {
				if (this.dataForm.lastIndex != '' && this.dataForm.currentIndex != '') {
					var num = (parseFloat(this.dataForm.currentIndex) - parseFloat(this.dataForm.lastIndex)).toFixed(2);
					if (this.dataForm.multiple != '') {
						num = (parseFloat(num) * parseFloat(this.dataForm.multiple)).toFixed(2);
					}
					if (this.dataForm.loss != '') {
						num = (parseFloat(num) + parseFloat(this.dataForm.loss)).toFixed(2);
					}
					this.dataForm.num = num;
					if (this.dataForm.price != '') {
						this.dataForm.total = (parseFloat(num) * parseFloat(this.dataForm.price)).toFixed(2);
					}
				}
			},
			changeMoney() {
				if (this.dataForm.price != '' && this.dataForm.num != '') {
					this.dataForm.total = (parseFloat(this.dataForm.num) * parseFloat(this.dataForm.price)).toFixed(2);
				}
			},
			changePrice() {
				for (var i = 0; i < this.feeItemList.length; i++) {
					if (this.feeItemList[i].id == this.dataForm.feeItemId) {
						this.dataForm.feeItemName = this.feeItemList[i].name;
					}
				}
			},

		}
	}
</script>
<style scoped lang='scss'>
	.editBtn span {
		color: red;
	}

	.deleteBtn span {
		color: red;
	}

	.detailBtn span {
		color: red;
	}

	.el-date-editor.el-input,
	.el-date-editor.el-input__inner {
		width: 100%;
	}

	.detailForm {
		.el-form-item {
			margin-bottom: 0px;
		}
	}

	.centered-content {
		display: flex;
		justify-content: center;
		align-items: center;
	}
</style>